
var cfg = {
	// radius should be small ONLY if scaleRadius is true (or small radius is intended)
	"radius": 1.2,
	//"maxOpacity": 0.9,
	"opacity":0.9,
	// scales the radius based on map zoom
	"scaleRadius": true,
	// if set to false the heatmap uses the global maximum for colorization
	// if activated: uses the data maximum within the current map boundaries
	//   (there will always be a red spot with useLocalExtremas true)
	"useLocalExtrema": false,
	// which field name in your data represents the latitude - default "lat"
	latField: 'lat',
	// which field name in your data represents the longitude - default "lng"
	lngField: 'lng',
	// which field name in your data represents the data value - default "value"
	valueField: 'count',
	blur: 0.95,
	//backgroundColor:'green',
	gradient: {
		// enter n keys between 0 and 1 here
		// for gradient color customization
		'0.1': '#8a7dc9',
		'0.125': '#9283d8',
		'0.15': '#978bda',
		'0.175': '#9a96da',
		'0.2': '#9c9fda',
		'0.225': '#9caed9',
		'0.25': '#9cbcd6',
		'0.275': '#9cc8d3',
		'0.3': '#91cad0',
		'0.325': '#76b9d0',
		'0.35':'#5ba4d0',
		'0.375': '#3585d0',
		'0.4': '#2373ca',
		'0.425': '#2873a2',
		'0.45':'#37767b',
		'0.475': '#4e7f47',
		'0.5': '#59832e',
		'0.525': '#5f8529',
		'0.55': '#6b8820',
		'0.575': '#7d8d17',
		'0.6': '#919213',
		'0.625': '#aa9815',
		'0.65':'#c6a01b',
		'0.6625':'#d8a51f',
		'0.675': '#e6a722',
		'0.6875': '#f2a825',
		'0.7': '#ffa829',
		'0.7125': '#ffa62a',
		'0.725': '#ffa12b',
		'0.7375': '#ff9a2c',
		'0.75': '#ff932d',
		'0.7625': '#ff882e',
		'0.775': '#fe7e2e',
		'0.7875': '#f9742f',
		'0.8': '#f5692f',
		'0.8125': '#f3632f',
		'0.825': '#ee5a2f',
		'0.8375': '#ea522f',
		'0.85': '#e54a2e',
		'0.875': '#d8372d',
		'0.9': '#d12c2c'
	}

};
 tem_heatLayer = new HeatmapOverlay(cfg)
var tem_heatData;
tem_heatLayer.addTo(map);
$.getJSON('./data/wind_tem_w.json',function(data){
	tem_heatData={max:50,min:-10,data:data}
	tem_heatLayer.setData(tem_heatData);
	//tem_heatLayer.addTo(map);
});

map.on("zoom",function(e){
	var zoom= map.getZoom();
	if(zoom <= 8){
		//tem_heatLayer.addTo(map);
		$(".leaflet-control-layers-selector").eq(0).trigger('click');
		$(".leaflet-tile-pane").css("z-index","401");
	}else{
		//tem_heatLayer.remove(map);
		$(".leaflet-control-layers-selector").eq(1).trigger('click');
		$(".leaflet-tile-pane").css("z-index","100");
	}
});
var radio=1;
$('#tabs_radio-monitor00-1').bind('click',function(){
		tem_heatLayer.addTo(map);
		map.removeLayer(wind_heatLayer);
		
		radio=1;
if(popup !==undefined){
			popup.remove(map);
		}
	});
$('#tabs_radio-monitor00-2').bind('click',function(){
		map.removeLayer(tem_heatLayer);
		//tem_heatLayer.remove(map);
		wind_heatLayer.addTo(map);
		radio=2;
		if(popup !==undefined){
			popup.remove(map);
		}
	});
var wind_cfg = {
	// radius should be small ONLY if scaleRadius is true (or small radius is intended)
	"radius": 1.2,
	//"maxOpacity": 0.5,
	"opacity":0.5,
	// scales the radius based on map zoom
	"scaleRadius": true,
	// if set to false the heatmap uses the global maximum for colorization
	// if activated: uses the data maximum within the current map boundaries
	//   (there will always be a red spot with useLocalExtremas true)
	"useLocalExtrema": false,
	// which field name in your data represents the latitude - default "lat"
	latField: 'lat',
	// which field name in your data represents the longitude - default "lng"
	lngField: 'lng',
	// which field name in your data represents the data value - default "value"
	valueField: 'count',
	blur: 0.5,
	//backgroundColor:'green',
	gradient: {
		0.01:'#686481',
		0.1:'#6161a3',
		0.2:'#4a68b6',
		0.3:'#428ab4',
		0.4:'#4fa897',
		0.5:'#4fb55c',
		0.6:'#5dc04e',
		0.7:'#91ca4a',
		0.8:'#d7ce3c',
		0.9:'#d69e43',
		1:'#d06759'
	}

};
var wind_heatLayer = new HeatmapOverlay(wind_cfg)
var wind_heatData;
$.getJSON('./data/wind_spe_w.json',function(data){
	wind_heatData={max:30,min:0,data:data}
	wind_heatLayer.setData(wind_heatData);
});
var popup;

map.on('click', function(e) {
	var lat = parseInt(e.latlng.lat);
	var lng = parseInt(e.latlng.lng);
	var data;
		switch(radio){
			case 1:
				data = tem_heatData.data;
				for(var i=0;i < data.length; i++){
						var jsonObj = data[i];
						if(jsonObj.lat ==lat && jsonObj.lng==lng){
							//alert(e.latlng);
							var option={maxWidth:200,closeButton:false,className:'popup-content'}
							popup = L.popup(option).setLatLng([e.latlng.lat,e.latlng.lng])
							.setContent(parseInt(jsonObj.count)+'°C<div class="circle"></div>').openOn(map);
							break;
							}
					}
				break;
			case 2:
			data = wind_heatData.data;
				for(var i=0;i < data.length; i++){
						var jsonObj = data[i];
						if(jsonObj.lat ==lat && jsonObj.lng==lng){
							var option={maxWidth:200,closeButton:false,className:'popup-content'}
							popup = L.popup(option).setLatLng([e.latlng.lat,e.latlng.lng]).setContent(parseInt(jsonObj.count*10)/10+'m/s<div class="circle"></div>').openOn(map);
							}
					}
				break;
			} 
    //alert(e.latlng.lat);
} );















//var temperature_heatLayer;
// load data (u, v grids) from somewhere (e.g. https://github.com/danwild/wind-js-server)
$.getJSON('./data/wind-gbr.json', function (data) {

	var velocityLayer = L.velocityLayer({
		displayValues: true,
		displayOptions: {
			velocityType: 'GBR Wind',
			displayPosition: 'bottomleft',
			displayEmptyString: 'No wind data'
		},
		data: data,
		maxVelocity: 15,
		colorScale: ['#034']
	});

	//layerControl.addOverlay(velocityLayer, 'Wind - Great Barrier Reef');
});

$.getJSON('./data/water-gbr.json', function (data) {
	var velocityLayer = L.velocityLayer({
		displayValues: true,
		displayOptions: {
			velocityType: 'GBR Water',
			displayPosition: 'bottomleft',
			angleConvention: 'bearingCW',
			displayEmptyString: 'No water data'
		},
		data: data,
		maxVelocity: 0.6,
		velocityScale: 0.1,// arbitrary default 0.005
		colorScale: ['#034']
	});

	//layerControl.addOverlay(velocityLayer, 'Ocean Current - Great Barrier Reef');

});
